﻿@inherits LayoutComponentBase

@using Microsoft.FluentUI.AspNetCore.Components

@implements IAsyncDisposable

@inject IJSRuntime Js
@inject ILogger<MainLayout> Logger
@inject NotificationService _notice
@inject ISageKingPackagesService _package
@inject SysSageKingMessageInstanceService _sysKingMessageInstanceService
@inject ReuseTabsService TabService

@using ButtonType=AntDesign.ButtonType
@using IMessageService=AntDesign.IMessageService
@using MudBlazor

<PageTitle>SageKing.Studio</PageTitle>

@implements ITableAutoSize

<Layout>

    <AntDesign.Sider @bind-Collapsed=collapsed NoTrigger OnCollapse="OnCollapse" Class="siderLeft">
        <div class="title">
            <b>SageKing.Studio @version</b>
        </div>
        <NavSysMenu collapsed="@collapsed" />
    </AntDesign.Sider>

    <Layout Class="site-layout">
        <Header Class="site-layout-Header-background" Style="padding: 0;">
            @if (collapsed)
            {
                <Icon Type="menu-unfold" Theme="IconThemeType.Outline" Class="trigger" OnClick="toggle" />
            }
            else
            {
                <Icon Type="menu-fold" Theme="IconThemeType.Outline" Class="trigger" OnClick="toggle" />
            }
        </Header>
        <Content Class="site-layout-background" Style="padding: 5px; margin: 0; min-height: 380px; overflow:hidden;">
            <ErrorBoundary @ref="errorBoundary">
                <ChildContent>
                    <ReuseTabs Class="tabs-height" TabPaneClass="content" Draggable="true" Body="Body">
                        <TabPaneTemplate>
                            <Content Class="site-layout-background" Style="padding: 0px;min-height: 280px;">
                                @context.Body
                            </Content>
                        </TabPaneTemplate>
                    </ReuseTabs>
                </ChildContent>
                <ErrorContent Context="ex">
                    @{
                        ShowNotification(ex);
                    }
                </ErrorContent>
            </ErrorBoundary>

        </Content>
    </Layout>
</Layout>

<FluentToastProvider />
<FluentDialogProvider />
<FluentTooltipProvider />
<FluentMessageBarProvider />

@* Required *@
<MudThemeProvider />
<MudPopoverProvider />

@* Needed for dialogs *@
<MudDialogProvider />

@* Needed for snackbars *@
<MudSnackbarProvider />

<style>
    .title {
        color: white;
        margin: 10px 10px 0 20px;
    }

    .trigger {
        padding: 0;
        z-index: 999;
        width: 18px;
        height: 18px;
        cursor: pointer;
        transition: color 0.3s;
        color: white;
        margin: 38px 0 0 8px;
    }

    .ant-menu-item a {
        text-decoration: none;
    }

    .modelDefault {
        min-width: 620px;
    }

    .maleft201 {
        margin-left: 201px;
    }

    .maleft121 {
        margin-left: 82px;
    }

    .ma50d {
        margin: 5px;
    }

    .trigger:hover {
        color: #1890ff;
    }

    .site-layout-Header-background {
        background: #001529;
    }

    .site-layout-background {
        background: #fff;
    }

    .showTotal {
        position: relative;
        margin: 3.5px 0 0 5px;
    }

    .childTable {
        box-shadow: 0px 0px 0.5px 0.5px #aaa;
    }

    .my-custom-pagination {
        position: relative;
        margin: 12px 0 10px 0;
    }

    .ant-table-pagination.ant-pagination {
        margin: 12px 0 0 0;
    }

    .my-custom-pagination .ant-pagination-item,
    .my-custom-pagination .ant-pagination-item-link {
        border-radius: 100%;
    }

    .main-table {
        min-height: @((browserHeight - 165) + "px");
    }

        .main-table .ant-table-body {
            margin-top: -15px;
        }

    .siderLeft {
        height: @(browserHeight + "px");
    }

    .tabs-height {
        min-height: @((browserHeight - 85) + "px");
    }

    .ant-tabs-top > .ant-tabs-nav,
    .ant-tabs-bottom > .ant-tabs-nav,
    .ant-tabs-top > div > .ant-tabs-nav,
    .ant-tabs-bottom > div > .ant-tabs-nav {
        margin-bottom: 0 !important;
    }
</style>

@code {
    string version;
    bool collapsed;
    bool isLoadNoticeAction = false;

    // windowsize
    private IJSObjectReference? module;
    private SKWindowSize? windowSize;

    //table height
    #region table auto size
    [Inject]
    public IResizeListener listener { get; set; }
    public Action StateHasChangedAction { get; set; }
    public ITableAutoSize MeTable { get { return this; } }
    public string ScrollY { get; set; } = BrowserConsts.ScrollY;
    public string ScrollY1080 { get; set; } = BrowserConsts.ScrollY1080;
    public double browserHeight { get; set; } = BrowserConsts.browserHeight;
    public double browserHeight1080 { get; set; } = BrowserConsts.browserHeight1080;
    public double ScrollYOffset { get; set; } = BrowserConsts.ScrollYOffset;
    public bool IsSmallMedia { get; set; } = false;
    // We can also capture the browser's width / height if needed. We hold the value here.
    public BrowserWindowSize browser { get; set; } = new BrowserWindowSize();
    public bool Islarge1080_800 { get; set; } = false;
    public string large1080_800 { get; set; } = BrowserAntDesignConsts.LargeHeight1080_800;
    [CascadingParameter]
    public Error? Error { get; set; }
    #endregion

    ErrorBoundary errorBoundary;

    #region
    string LeftMenuAutoHideClass = "site-layout maleft201";
    #endregion
    protected override async Task OnInitializedAsync()
    {
        version = 1.GetVersion().ToString();

        if (!isLoadNoticeAction)
        {
            _package.NoticeAction += (msg, desc, type) =>
            {
                _notice.Open(new NotificationConfig()
                    {
                        Message = msg,
                        Description = desc
                    });
            };
            _package.OnGetMessagePosFunc = true;
            _package.GetMessagePosFunc = _sysKingMessageInstanceService.GetPosDic;

            isLoadNoticeAction = true;
        }

        StateHasChangedAction = () =>
        {
            BrowserConsts.ScrollYTable = ScrollY;
            StateHasChanged();
        };

        await MeTable.InitTableHeight(true);
        BrowserConsts.ScrollYTable = ScrollY;
    }
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            // Subscribe to the OnResized event. This will do work when the browser is resized.
            listener.OnResized += MeTable.WindowResized;

            try
            {
                string path = "./Pages/JsCollocation/JsComm.razor.js";
                module = await Js.InvokeAsync<IJSObjectReference>("import", path);

                if (module is not null)
                {
                    windowSize = await module.InvokeAsync<SKWindowSize>("windowSize");
                    if (windowSize != null)
                    {
                        browserHeight = windowSize.pageHeight;
                        ScrollY = $"{browserHeight - ScrollYOffset}px";

                        BrowserConsts.WindowSize = windowSize;
                    }
                }
            }
            catch (Exception ex)
            {
                Error?.ProcessError(ex);
            }
        }
        else
        {
            if (module is not null)
            {
                windowSize = await module.InvokeAsync<SKWindowSize>("windowSize");
                if (windowSize != null)
                {
                    BrowserConsts.WindowSize = windowSize;
                }
            }
        }

        BrowserConsts.ScrollYTable = ScrollY;
        StateHasChanged();
    }
    async ValueTask IAsyncDisposable.DisposeAsync()
    {
        if (module is not null)
        {
            await module.DisposeAsync();
        }
    }
    void toggle()
    {
        collapsed = !collapsed;
        if (!collapsed)
        {
            LeftMenuAutoHideClass = "site-layout maleft201";
        }
        else
        {
            LeftMenuAutoHideClass = "site-layout maleft121";
        }
    }

    void Reload()
    {
        TabService.ReloadPage();
    }

    void OnCollapse(bool isCollapsed)
    {
        Console.WriteLine($"Collapsed: {isCollapsed}");
    }

    void ShowNotification(Exception ex)
    {

        Logger.LogError($"Error:ProcessError - Type: {ex.GetType()} Message: {ex.Message} StackTrace:{ex.StackTrace}");

        _ = _notice.Error(new()
            {
                Message = "错误提示",
                Description = ex.Message,
                Duration = 0,
            });

        errorBoundary.Recover();
    }
}